<template>
    <div>
        <Modal v-model="modalSs11002" :title=title width="850" cancel-text="关闭" style="position:relative;">
            <Form ref="dataSs11002" :model="dataSs11002" :rules="ruleSs11002" inline :label-width="180"
                  :disabled=readonly>
                <table style="width:100%;">
                    <tr>
                        <td style="width:33%;" >
                            <FormItem label="姓名" prop="azcp0003">
                                <Input v-model="dataSs11002.azcp0003" placeholder="" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td style="width:33%;" >
                            <FormItem label="与申请人关系" prop="azcp0517">
                                <Select v-model="dataSs11002.azcp0517" placeholder="" class="itemStyle">
                                    <Option v-for="item in relationList" :value="item.value" :key="item.value">{{ item.label }} </Option>
                                </Select>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="证件号码" prop="azcp0001">
                                <Input v-model="dataSs11002.azcp0001" placeholder="" class="itemStyle" @on-blur="checkIdcard()"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="证件类型">
                                <c-dict-select v-model="dataSs11002.azcp0002" dictCode="certificatetype" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="户籍类别">
                                <c-dict-select v-model="dataSs11002.azcp0014" dictCode="registertype" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="民族">
                                <c-dict-select v-model="dataSs11002.azcp0007" dictCode="nation" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="文化程度">
                                <c-dict-select v-model="dataSs11002.azcp0019" dictCode="education" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="政治面貌">
                                <c-dict-select v-model="dataSs11002.azcp0020" dictCode="politicaloutlook" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="婚姻状况">
                                <c-dict-select v-model="dataSs11002.azcp0021" dictCode="maritalstatus" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="学业状况">
                                <c-dict-select v-model="dataSs11002.acax0204" dictCode="educationstatus" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="就业状况" prop="acax0205">
                                <c-dict-select v-model="dataSs11002.acax0205" dictCode="workstatus" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="劳动能力丧失情况" prop="azcp0502">
                                <c-dict-select v-model="dataSs11002.azcp0502" dictCode="workability" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="健康状况">
<!--                                <dictSelect :sel_val='dataSs11002.azcp0009' :bindData.sync="dataSs11002.azcp0009" :disabled="azcp0009Disabled"-->
<!--                                            dictCode="health" @changeState="setHealthState01" class="itemStyle"/>-->
                                <c-dict-select v-model="dataSs11002.azcp0009" dictCode="health" class="itemStyle" @changeState="setHealthState01"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="生活自理能力">
                                <c-dict-select v-model="dataSs11002.acax0210" dictCode="selfcareability" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="是否残疾" prop="azcp0503">
<!--                                <dictSelect   :sel_val='dataSs11002.azcp0503' :bindData.sync="dataSs11002.azcp0503"-->
<!--                                               dictCode="yesorno" @changeState="setDisabilityState01" class="itemStyle"/>-->
                                <c-dict-select v-model="dataSs11002.azcp0503" dictCode="yesorno" class="itemStyle" @changeState="setDisabilityState01"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <FormItem label="残疾类别" :rules="ruleAzcp0504">
                                <c-dict-select v-model="dataSs11002.azcp0504" dictCode="disabilitytype" :disabled="disabledCjr" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td >
                            <FormItem label="残疾等级" :rules="ruleAzcp0505">
                                <c-dict-select v-model="dataSs11002.azcp0505" dictCode="disabilityclass" :disabled="disabledCjr" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <FormItem label="月收入" prop="azzx0016">
                                <Input v-model="dataSs11002.azzx0016" placeholder="请输入月收入" class="itemStyle" type="number"/>
                            </FormItem>
                        </td>
                        <td>
                            <FormItem label="是否有车辆">
                                <c-dict-select v-model="dataSs11002.azzx0017" dictCode="yesorno" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <FormItem label="车辆品牌">
                                <Input v-model="dataSs11002.azzx0018" placeholder="" class="itemStyle"/>
                            </FormItem>
                        </td>
                        <td>
                            <FormItem label="车牌号码">
                                <Input v-model="dataSs11002.azzx0019" placeholder="" class="itemStyle"/>
                            </FormItem>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <FormItem label="房产数量">
                                <Input v-model="dataSs11002.azzx0020" placeholder="" class="itemStyle" type="number"/>
                            </FormItem>
                        </td>
                        <td>
                            <FormItem label="房产总面积">
                                <Input v-model="dataSs11002.azzx0021" placeholder="" class="itemStyle" type="number"/>
                            </FormItem>
                        </td>
                    </tr>
                </table>
            </Form>
            <div slot="footer">
                <Button type="text" size="large" @click="modalSs11002 = false">取消</Button>
                <Button type="primary" size="large" @click="handleSubmitSs11002('dataSs11002')" :loading="btnLoading"
                        :disabled="validateStatus" v-if=!readonly>确定
                </Button>
            </div>
        </Modal>
    </div>
</template>

<script>
    import {getAction, postAction} from '@/api/request'
    import {IdentityCodeValid, getAgeByIdcardByHD} from '@/plugins/idcardValid.js'


    export default {
        components: {},
        data() {
            return {
                btnLoading: false,
                acfx0101: '',
                azcp0009Disabled: false,
                dataSs11002:{},
                showxz: false,
                azcp0584Disabled: true,
                disabledCjr: true,
                readonly: false,
                ss11001Id: '',
                upPicData: {},
                picPreviewMol: {
                    preShow: false,
                    pic_urls: [],
                    picIndex: 0
                },
                up_pic_mol: false,
                url: {
                    insertMember: '/api/ac/subsistence/ss02050Service/insertMember',
                    updateMember: '/api/ac/subsistence/ss02050Service/updateMember',
                },
                identityCardVisible: true,
                householdRegisterVisible: false,
                title: '',
                relationList: [], //保障人员家庭关系
                modalSs11002: false, //保障人员model显隐
                healthState01: false,  //保障人员健康状况联动状态
                disabilityState01: false, //保障人员残疾联动状态
                azcp0583Disabled: true, //单人保类型
                maimState: false,  //伤残联动状态
                medicalInsuranceState: true, //医保联动状态
                fieldsToValidate01: ['azcp0003','azcp0517','azcp0001','acax0205','azcp0502','azzx0016'],
                ruleSs11002: {
                    azcp0003: [
                        {required: true, message: '请输入姓名', trigger: 'blur'}
                    ],
                    azcp0517: [
                        {required: true, message: '请选择与申请人关系', trigger: 'blur'}
                    ],
                    azcp0001: [
                        {required: true, message: '请输入证件号码', trigger: 'blur'}
                    ],
                    acax0205: [
                        {required: true, message: '请选择就业状况', trigger: 'blur'}
                    ],
                    azcp0009: [
                        {required: true, message: '请选择健康状况', trigger: 'blur'}
                    ],
                    azcp0502: [
                        {required: true, message: '请选择有无劳动能力', trigger: 'blur'}
                    ],
                    azzx0016: [
                        {required: true, message: '请输入月收入(元)', trigger: 'blur'}
                    ],
                },
                ruleAzcp0504: {message: '请选择残疾类别', trigger: 'blur'},
                ruleAzcp0505: {message: '请选择残疾等级', trigger: 'blur'},
                ruleAzcp0524: {message: '请选择重病病种', trigger: 'blur'},
                ruleAzcp0525: {message: '请填写重病名称', trigger: 'blur'},
                ruleAzcp0508: {message: '请选择伤残等级', trigger: 'blur'},
                validateStatus: true, //查验状态 true 未查验或查验异常 false 查验通过
                //批次号
                batchNumber: '',
                validateInfo: '',
                ss00011ModelShow: false,
            }
        },
        methods: {
            create() {
                let that = this
                that.readonly = false
                // that.dataSs11002 = {}
                that.title = '保障家庭成员录入'
                that.modalSs11002 = true
                // that.initRelation01()
                that.handleRelationship('member')

            },
            async edit(record) {
                let that = this
                that.readonly = false
                that.title = '保障家庭成员编辑'
                if (record.azcp0517 == '01') {
                    await that.handleRelationship('master')
                } else {
                    await that.handleRelationship('member')
                }
                that.modalSs11002 = true
                that.dataSs11002 = Object.assign({}, record)
                record.ssca0002 = this.$parent.$parent.applicationType;
                that.dataSs11002.azcp0509 = new Date(record.azcp0509)
                that.initRelation01()
                let azcp0519 = that.dataSs11002.azcp0519
                that.checkIdcard()
            },
            async view(record) {
                let that = this
                that.readonly = true
                that.title = '保障家庭成员详情'
                if (record.azcp0517 == '01') {
                    await that.handleRelationship('master')
                } else {
                    await that.handleRelationship('member')
                }
                that.modalSs11002 = true
                that.dataSs11002 = Object.assign({}, record)
                that.dataSs11002.azcp0509 = new Date(record.azcp0509)
                that.initRelation01()
                let azcp0519 = that.dataSs11002.azcp0519
                that.checkIdcard()
            },
            handleSubmitSs11002(name) { // 保障人员信息提交
                let that = this
                let validate = true
                let err_msg = []
                that.btnLoading = true
                for (let item of this.fieldsToValidate01) {
                    this.$refs[name].validateField(item, (error) => {
                        if (error) {
                            validate = false
                            err_msg.push(this.ruleSs11002[item][0].message)
                        }
                    })
                }
                if ((that.dataSs11002.azzx0021 != '' || that.dataSs11002.azzx0021 != undefined) && (that.dataSs11002.azzx0020 == '' || that.dataSs11002.azzx0020 == undefined)){
                    that.$Message.error('请录入房产数量')
                    that.btnLoading = false
                    return
                }
                if ((that.dataSs11002.azzx0020 != '' || that.dataSs11002.azzx0020 != undefined) && (that.dataSs11002.azzx0021 == '' || that.dataSs11002.azzx0021 == undefined)){
                    that.$Message.error('请录入房产总面积')
                    that.btnLoading = false
                    return
                }
                if (validate) {
                    let dataParam = {}
                    dataParam = Object.assign({}, that.dataSs11002)
                    let url = null
                    if (dataParam.id == null || dataParam.id == '') {
                        url = that.url.insertMember
                        dataParam.acfx0101 = that.acfx0101
                    } else {
                        url = that.url.updateMember
                    }
                    postAction(url, dataParam).then((res) => {
                        console.log("res: ", res)
                        if (res.data.data.errcode == 0){
                            that.$Message.success(res.data.data.msg)
                            that.$emit('ok')
                        }else{
                            that.$Message.error('信息保存失败, 请联系管理员')
                        }
                    }).finally(() => {
                        that.modalSs11002 = false
                        that.btnLoading = false
                        that.$parent.reloadData();
                    })
                } else {
                    that.$Message.error(err_msg[0])
                    that.btnLoading = false
                    return
                }
            },
            initRelation01() { //初始化保障人员页面选择联动
                let that = this
                that.setDisabilityState01();
                that.setMaimState()
                that.setHealthState01()
                that.setMedicalInsuranceState()
            },
            setDisabilityState01() { //残疾联动
                let that = this
                let value = that.dataSs11002.azcp0503
                if (value == '1') {
                    that.disabilityState01 = false
                    that.dataSs11002.azcp0009 = null
                    that.azcp0009Disabled = true
                    that.disabledCjr = false
                    that.ruleAzcp0504 = [{required: true, message: '请选择残疾类别', trigger: 'blur'}]
                    that.ruleAzcp0505 = [{required: true, message: '请选择残疾等级', trigger: 'blur'}]
                    that.ruleSs11002.azcp0504 = that.ruleAzcp0504
                    that.ruleSs11002.azcp0505 = that.ruleAzcp0505
                } else {
                    that.azcp0009Disabled = false
                    that.disabledCjr = true
                    that.ruleAzcp0504 = [{required: false}]
                    that.ruleAzcp0505 = [{required: false}]
                    that.dataSs11002.azcp0504 = ''
                    that.dataSs11002.azcp0505 = ''
                    that.dataSs11002.azcp0506 = null
                    that.disabilityState01 = true
                    delete that.ruleSs11002.azcp0504
                    delete that.ruleSs11002.azcp0505
                }
            },
            setHealthState01() {  //健康联动
                let that = this
                let value = that.dataSs11002.azcp0009
                if (value == '40') {  //重病
                    that.healthState01 = false
                    that.ruleAzcp0525 = [{required: true, message: '请填写重病名称', trigger: 'blur'}]
                    that.ruleAzcp0524 = [{required: true, message: '请选择重病病种', trigger: 'blur'}]
                    that.ruleSs11002.azcp0525 = that.ruleAzcp0525
                    that.ruleSs11002.azcp0524 = that.ruleAzcp0524
                } else { //健康、一般、慢性病
                    that.ruleAzcp0525 = [{required: false}]
                    that.ruleAzcp0524 = [{required: false}]
                    that.dataSs11002.azcp0524 = ''
                    that.dataSs11002.azcp0525 = ''
                    that.healthState01 = true
                    delete that.ruleSs11002.azcp0525
                    delete that.ruleSs11002.azcp0524
                }
            },
            setMaimState() { //伤残联动
                let that = this
                let value = that.dataSs11002.azcp0507
                if (value == '1') {
                    that.maimState = false
                    that.ruleAzcp0508 = [{required: true, message: '请选择伤残等级', trigger: 'blur'}]
                    that.ruleSs11002.azcp0508 = that.ruleAzcp0508
                } else {
                    that.ruleAzcp0508 = [{required: false}]
                    that.dataSs11002.azcp0508 = ''
                    that.dataSs11002.azcp0509 = ''
                    that.maimState = true
                    delete that.ruleSs11002.azcp0508
                }
            },
            setMedicalInsuranceState() {  //医保联动
                let that = this
                let value = that.dataSs11002.azcp0527
                if (value == '1') {
                    that.medicalInsuranceState = false
                    that.ruleAzcp0528 = [{required: true, message: '请选择医疗保险类型', trigger: 'blur'}]
                    that.ruleSs11002.azcp0528 = that.ruleAzcp0528
                } else {
                    that.ruleAzcp0528 = [{required: false}]
                    that.dataSs11002.azcp0528 = ''
                    that.medicalInsuranceState = true
                    delete that.ruleSs11002.azcp0528
                }
            },
            async handleRelationship(type) {
                let that = this
                let param = {}
                param.pageNo = 1// 当前页数
                param.pageSize = 999//每页显示条数
                param.type = 'familyrelationship' //字典type值
                await postAction('/api/as/sc/dict/getDictList', param).then((res) => {
                    if (res.data.errcode === 0) {
                        if (type == 'master') {
                            let arr = res.data.data.results
                            for (let j = 0; j < arr.length; j++) {
                                let item = arr[j]
                                if (item.value != '01') {
                                    arr.splice(j--, 1)
                                }
                            }
                            that.relationList = arr
                        } else {
                            let arr = res.data.data.results
                            for (let j = 0; j < arr.length; j++) {
                                let item = arr[j]
                                if (!that.readonly) { //非只读模式过滤掉旧版家庭关系字典
                                    if (item.value == '01' || item.value == '10' || item.value == '20' || item.value == '30' || item.value == '40'
                                        || item.value == '50' || item.value == '60' || item.value == '70') {
                                        arr.splice(j--, 1)
                                    }
                                }
                            }
                            that.relationList = arr
                        }
                    }
                })
            },
            checkIdcard() {  //验证身份证是否合法并判断证件上传类型
                let that = this
                let azcp0001 = that.dataSs11002.azcp0001
                if (azcp0001 != '' && typeof (azcp0001) != 'undefined') {
                    azcp0001 = azcp0001.toUpperCase()
                    that.dataSs11002.azcp0001 = azcp0001
                    if (!IdentityCodeValid(azcp0001)) {
                        that.$Message.error('申请人身份证号码格式不合法')
                        that.dataSs11002.azcp0001 = null
                    }
                }
            },
        },
        watch: {},
    }
</script>

<style scoped>
    /deep/ .ivu-form-item-error-tip {
        display: none;
    }

    .ivu-form-item {
        margin-bottom: 0px;
    }

    .itemStyle {
        width: 180px
    }

    .head-img1 {
        height: 200px;
        width: 343px;
        margin-top: 15px;
    }

    .imgBackColor {
        background-color: WhiteSmoke;
        height: 250px;
    }

    .positiveTDiv {
        height: 240px;
        width: 80px;
        line-height: 240px;
        background-color: #7CCD7C;
        margin-bottom: 10px;
        color: white;
        font-size: 15px;
        font-weight: 700;
        margin-left: 15px;
        border-radius: 3px;
    }

    .positiveBDiv {
        height: 120px;
        width: 80px;
        background-color: #7CCD7C;
        line-height: 120px;
        color: white;
        font-size: 15px;
        font-weight: 700;
        margin-left: 15px;
    }

    .headerBtnDiv {
        height: 160px;
        width: 120px;
        float: right;
        margin-right: 80px;
        background: #5CACEE;
        border-radius: 3px;
        color: white;
        text-align: center;
        line-height: 160px;
        font-weight: 600;
        font-size: 20px;
    }
</style>
